<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Jx.Progressbar Examples</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="../../lib/mootools-core.js"></script>
<script type="text/javascript" src="../../lib/mootools-more.js"></script>
<script type="text/javascript" src="../../lib/jxlib.standalone.uncompressed.js"></script>
<script src="js/tests.js" type="text/javascript" charset="utf-8"></script>
<script src="js/locale.js" type="text/javascript" charset="utf-8"></script>
<script  type="text/javascript">
window.addEvent('load', function() {
    drawBasicProgressbar();
}); 
if($(document).getElements('.tabContentActiveExamples').length > 0) {
  $(document).getElements('.tabContentActiveExamples')[0].addEvent('loadAjax', function() {
    drawBasicProgressbar();
  });
}
</script>
<script id="basicProgressbarScript" type="text/javascript" charset="utf-8">
function drawBasicProgressbar() {
  var progressBar = new Jx.Progressbar({
      parent: 'progressbarBasic'
  });
  progressBar.addEvent('update',function(){
      log('updated!');
      fn.delay(300);
  });
  progressBar.addEvent('complete',function(){
      b1.setBusy(false);
      log('completed!');
  });
  
  var  total = 20;
  var progress = 0;
  var fn = function() {
      progress++;
      progressBar.update(total,progress);
  }
  
  var b1 = new Jx.Button({
      label: {set:'Examples',key:'progressBar',value:'runButton'},
      busyMask: {
        message: 'Busy!',
        'class': 'jxSpinner jxSpinnerLarge'
      },
      onClick: function(){
          total = 20;
          progress = 0;
          fn();
          b1.setBusy(true);
      }
  }).addTo('progressbarBasic');
}
</script>
</head>
<body>

<h1>Jx.Progressbar Examples</h1>
<p>API Reference: <a id="progressbar-js" href="javascript:void();" title="link to API Reference">Jx.Progressbar</a></p>

<h2 id="basicProgressbar">A Progress Bar</h2>
<p>A progress bar.</p>
<div id="progressbarBasic" class=""></div>


</body>
</html>